import React, { Component } from 'react';
import actions from '../store/actions/saga';
import { connect } from 'react-redux';
import Router, { withRouter } from 'next/router';
import { Pagination, Tabs, Button } from 'antd';

import css from '../styles/saga.scss';

const Detail = props => {
    console.log('范湖');
    console.log(props);
    const { isFetching, sagaNewsDetail } = props;
    return (
        <div className={css.saga}>
            {isFetching && <div>加载中…</div>}
            {!isFetching && (
                <div>
                    <div className={css.back}>
                        <h2>{sagaNewsDetail.title}</h2>
                        <div className={css.title}>
                            <span>{sagaNewsDetail.source}</span>
                            <span>{sagaNewsDetail.ptime}</span>
                            <a onClick={() => Router.back()}>返回上层</a>
                        </div>
                    </div>

                    <div
                        dangerouslySetInnerHTML={{
                            __html:
                                props.sagaNewsDetail &&
                                props.sagaNewsDetail.content
                        }}></div>
                </div>
            )}
        </div>
    );
};

Detail.getInitialProps = async context => {
    console.log('请多多的');
    console.log(context);
    const { store, isServer, router, query } = context;
    const id = query.id;
    await store.dispatch(actions.fetchNewsDetail(id));
    console.log('新闻订单的');
    console.log(store);
    return { title: '新闻详情' };
};

export default connect(state => state.saga)(withRouter(Detail));
